import global from '@/utils/globalUtils';
import type { PageContainerProps } from '@ant-design/pro-layout';
import { PageContainer } from '@ant-design/pro-layout';
import { Outlet, useLocation } from '@umijs/max';
import { eventsBusFn, findMenuRoute } from '@vh-admin/pro-utils';
import { useEffect, useState } from 'react';
import routesConfig from '../../config/routes';

const eventsBus = eventsBusFn();

export default function () {
  global.log('我是全局PageContainer。');
  const [config, setConfig] = useState<PageContainerProps>({});
  const location = useLocation();

  useEffect(() => {
    const router = findMenuRoute(location.pathname, routesConfig);

    let nowConfig: any = {};

    if (router) {
      if (router.pageContainer === false) {
        nowConfig = {
          header: {
            title: null,
            breadcrumb: {},
          },
        };
      }
    }
    setConfig(nowConfig);
  }, [location.pathname]);

  useEffect(() => {
    eventsBus.$on('setPageContainerConfig', (data: PageContainerProps) => {
      setTimeout(() => {
        setConfig(data);
      }, 100);
    });

    return () => {
      eventsBus.$off('setPageContainerConfig');
    };
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);

  // if (!globalInfo) {
  //   return loading;
  // }
  return (
    <>
      <PageContainer
        fixedHeader
        {...config}
        affixProps={{
          offsetTop: undefined,
        }}
      >
        <Outlet />
      </PageContainer>
    </>
  );
}
